<%-- 
    Document   : buyIndex
    Created on : 2010-3-9, 15:47:01
    Author     : fengbj
--%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http ://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="xxxxxxxxxxxxxxxxxxx" />
<meta name="keywords" content="xxxxxxxxxxxxxxxx" />
<meta name="robots" content="all" />
<link rel="stylesheet" type="text/css" href="style/style.css" />
<title>2-1</title>
</head>
<body>
<div class="pays">
  <!--页头-->
  <jsp:include page="common/head.jsp"/>
  <jsp:include page="common/navBar.jsp"/>
  <!--主盒子-->
  <div class="paysMain">
    <jsp:include page="common/mainleft.jsp"/>
    <div class="mainright">
      <div class="tipZone">
        <div class="leftTopimg"></div>
        <div class="tipZoneBkleft"></div>
        <div class="tipZoneBkright"></div>
        <div class="steps">
          <div class="steps111" id="step1"></div>
          <div class="steps22"  id="step2"></div>
          <div class="steps33"  id="step3"></div>
          <div class="steps44"  id="step4"></div>
          <div class="steps55"  id="step5"></div>
        </div>
        <div class="tipregion"> <img class="tipsIocn" src="images/tipsIcon.gif"/>
          <p>请您选择你要购买的服务<br />
            <span class="bluetip">服务有效期自购买服务日计算。（例如您今天购买了“一年期服务”，则您购买的服务为从今天开始算起，一年后到期。）</span></p>
        </div>
      </div>
      <div class="adpaysMain4">
        <div  class="adpaysMainleft"></div>
        <div  class="adpaysMainright"></div>
        <div  class="buyservicelist">
          <form class="buysl" method="post" action="/buySelectPriceProcess.action">
            <input type="radio" checked="checked" name="price" value="299.00"/>
            <span class="buysltitle">终生期服务</span><span class="moneyyuan">￥299.00元</span><span class="notes">可以终生免费使用导航软件并更新地图</span> <br/>
            <input type="radio" name="price" value="99.00"/>
            <span class="buysltitle">一年期服务</span><span class="moneyyuan">￥99.00元</span><span class="notes">可以在一年内免费使用导航软件并更新地图</span> <br/>
            <input type="radio" name="price" value="50.00"/>
            <span class="buysltitle">半年期服务</span><span class="moneyyuan">￥50.00元</span><span class="notes">可以在半年内免费使用导航软件并更新地图</span>
            <div class="btnOk">
              <div class="btnLogin">
                <div class="btnBkleft"></div> 
				<div class="btnBkcenter"><input name="submit" type="submit" id="submit" class="btnBkcenter"  value="确定" /></div>
                <div class="btnBkright"></div>
              </div>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
</div>
<jsp:include page="common/foot.jsp"/>

<jsp:include page="common/js.jsp"/>
<s:if test="needLogon != null">
  <div id="showDiv" style="display: none">
    <div class="loginlayer" >
      <div class="loginlayertitle">登录</div>
      <p class="loginsay">为了给你提供更好的服务，请您先登录；<br/>
        如果您还没有图吧帐号，请注册。</p>
      <div class="loginlist">
        <ul>
          <li class="logintitle" id="logonLi"><a href="javascript:;" id="logonBtn">登录</a></li>
          <li class="registertitle" id="regLi"><a href="javascript:;" id="regBtn">注册</a></li>
        </ul>
      </div>
      <div>
        <div class="loginarea" id="logon">
          <P>用户名</p><input class="textfield" type="text"  name="name" id="buyUserName"/><br />
          
          <P>密&nbsp;&nbsp;&nbsp;码</p><input class="textfield" type="password"  name="pwd" id="buyPwd"/>
          
          <a href="">忘记密码？</a>
          <div class="rememberme">
            <input class="rememberme2" id="rememberme2" type="checkbox"  id="buyRemember"/>
            <label for="rememberme2">记住我的登陆状态</label>
          </div>
          <div class="loginlistbtn">
            <div class="btnLogin">
              <div class="btnBkleft"></div>
              <div class="btnBkcenter"><span onclick="mapbar.pay.logon.buyLogon()">确定</span></div>
              <div class="btnBkright"></div>
            </div>
          </div>
        </div>
        <div class="loginarea2" id="reg" style="display: none">
          <P  class="loginsay3">请输入以下信息完成注册</P>
          <form id="form1" name="form1" method="post" action="">
            <table>
              <tr>
                <th><span>*</span>用户名</th>
                <td><input class="textfield" type="text"  id="regUserName" maxlength="20"/></td>
              </tr>
              <tr>
                <th><span>*</span>密码</th>
                <td><input class="textfield" type="password"  id="regPwd" maxlength="16"/></td>
              </tr>
              <tr>
                <th><span>*</span>确认密码</th>
                <td><input class="textfield" type="password"  id="regPwdTwo" maxlength="16"/></td>
              </tr>
              <tr>
                <th><span>*</span>电子邮件</th>
                <td><input name="text" type="text" class="textfield"  id="regEMail"/></td>
              </tr>
              <tr>
                <th>手机号码</th>
                <td><input name="text" type="text"  class="textfield" id="regPhone" /></td>
              </tr>
              <tr>
                <th>导航仪序列号</th>
                <td>
                  <input class="textfield3" type="text"  id="regSerial1" maxlength="4" name="regSerial"/>
                  <input class="textfield3" type="text"  id="regSerial2" maxlength="4"  name="regSerial"/>
                  <input class="textfield3" type="text"  id="regSerial3" maxlength="4"  name="regSerial"/>
                  <input class="textfield3" type="text"  id="regSerial4" maxlength="4"  name="regSerial"/>
                  <a  href="">什么是序列号？</a></td>
              </tr>
            </table>
            <table class="selectDevice">
              <tr>
                  <td><input name="regType" type="radio" id="ipnduser" checked value="pnd"/></td>
                <th><label for="ipnduser">我是导航仪用户</label></th>
                <td><input name="regType" type="radio" id="imobileuser" value="mobile" disabled/></td>
                <th><label for="imobileuser">我是导手机用户</label></th>
              </tr>
              <tr>
                <td colspan="4"><a href="">图吧家园服务、条款</a></td>
              </tr>
            </table>
          </form>
          <div class="btnLogin6">
            <div class="btnBkleft"></div>
            <div class="btnBkcenter" id="regSubmit">同意条款并立即注册</div>
            <div class="btnBkright"></div>
          </div>
        </div>
        <a href="javascript:return false;" id="close" class="loglayeroff"></a> </div>
    </div>
  </div>
  <script>


                var content = $("#showDiv").html();
                $("#showDiv").remove();
                $.showWindow(null , content , "#close").show();

                $("#step1").removeClass().addClass("steps11");
                $("#step2").removeClass().addClass("steps222");

                $("input[name='price'][value='${price}']").attr("checked" , true);
                window.flag = true;
                $("#buyUserName").keyup(function(event){
                    //if(13 == event.keyCode && window.flag){
                    //   mapbar.pay.logon.buyLogon();
                    //   window.flag = false;
                    //   setTimeout(function(){window.flag=true;} , 300);
                    //}
                })
                $("#buyPwd").keyup(function(event){
                    //alert(window.flag)
                    //if(13 == event.keyCode && window.flag)
                    //  mapbar.pay.logon.buyLogon();
                    //  window.flag = false;
                    // setTimeout(function(){window.flag=true;} , 300);
                })

                $("#logonBtn").click(function(){
                    $("#logon").css("display" , "block");
                    $("#reg").css("display" , "none");

                    $("#logonLi").removeClass().addClass("logintitle");
                    $("#regLi").removeClass().addClass("registertitle");

                });
                $("#regBtn").click(function(){

                    $("#reg").css("display" , "block");
                    $("#logon").css("display" , "none");

                    $("#regLi").removeClass().addClass("logintitle");
                    $("#logonLi").removeClass().addClass("registertitle");


                });
                $("#regSubmit").click(function(){
                    mapbar.pay.logon.reg();
                });
                 $("input[name='regSerial']").keyup(mapbar.pay.activationcode.move);

            </script>
</s:if>
</body>
</html>
